
    <title>Title</title>
    {include file="public/header" /}

    <div id="test12" class="demo-tree-more"></div>
    <script>
        layui.use(['tree', 'util'], function(){
            var tree = layui.tree
                ,layer = layui.layer
                ,util = layui.util
                ,$ = layui.jquery;

                var data1 = [];
                $.ajax({
                    type:"POST",
                    url:"data",
                    dataType:"JSON",
                    async:false,
                    success:function (msg) {
                        data1 = msg;
                    }
                });


            //基本演示
            tree.render({
                elem: '#test12'
                ,data: data1
                ,showCheckbox: true  //是否显示复选框
                ,edit: ['add', 'update', 'del'] //操作节点的图标
                ,id: 'demoId1'
                ,isJump: true //是否允许点击节点时弹出新窗口跳转
                ,click: function(obj){
                    var data = obj.data;  //获取当前点击的节点数据
                    layer.msg('状态：'+ obj.state + '<br>节点数据：' + JSON.stringify(data));
                }
                ,operate: function(obj){
                    var type = obj.type; //得到操作类型：add、edit、del
                    var data = obj.data; //得到当前节点的数据
                    var elem = obj.elem; //得到当前节点元素

                    //Ajax 操作
                    var id = data.id; //得到节点索引
                    if(type === 'add'){ //增加节点
                        location.href="add/id/"+id;
                    } else if(type === 'update'){ //修改节点
                        //location.href="add/id/"+id;
                        var cate_name =  elem.find('.layui-tree-txt').html(); //得到修改后的内容
                        $.post('update',
                            {
                                id:id,
                                cate_name:cate_name
                            },
                            function (data) {
                                if(data.code == 400){
                                    alert(data.msg);
                                    location.reload();
                                }
                            }
                        )

                    } else if(type === 'del'){ //删除节点
                        $.post('del',
                            {
                                id:id
                            },
                            function (data) {
                            alert(data.msg);

                            }
                        )
                    }
                     }
            });



            //按钮事件
            util.event('lay-demo', {
                getChecked: function(othis){
                    var checkedData = tree.getChecked('demoId1'); //获取选中节点的数据

                    layer.alert(JSON.stringify(checkedData), {shade:0});
                    console.log(checkedData);
                }
                ,setChecked: function(){
                    tree.setChecked('demoId1', [12, 16]); //勾选指定节点
                }
                ,reload: function(){
                    //重载实例
                    tree.reload('demoId1', {

                    });

                }
            });


            //开启节点操作图标
            tree.render({
                elem: '#test9'
                ,data: data1
                ,edit: ['add', 'update', 'del'] //操作节点的图标
                ,click: function(obj){
                    layer.msg(JSON.stringify(obj.data));
                }
            });
        });
    </script>
    {include file="public/footer" /}
